import { ref, computed } from 'vue'
import type { QuotaItem, QuotaDetailItem } from '@/store/type'
// import { formatDate, getQuarter, toDate } from '@/utils/date'
import QuotaServe from '@/api/quota'

function useQuotaItem(quota: QuotaItem) {
  const showDetail = ref<QuotaDetailItem | null>()

  const timestr = computed(() => {
    // return props.quota?.datetime
    const { datetime, dataUpdateFrequency } = quota

    const date = datetime ? datetime.split(' ')[0] : null
    const year = date ? date.split('-')[0] : ''
    const month = date ? Number(date.split('-')[1]) : ''
    const index = Number(month) % 3 == 0 ? Number(month) / 3 : Number(month) / 3 + 1

    switch (dataUpdateFrequency) {
      case 'timely':
        return '实时'
      case 'daily':
        return '日更'
      case 'monthly':
        return year + '年' + month + '月'
      // return formatDate(datetime, 'yyyy年M月')
      case 'quarterly':
        //  "季度";
        return ['一', '二', '三', '四'][index - 1] + '季度'
      // return ['一', '二', '三', '四'][getQuarter(toDate(datetime)) - 1] + '季度'
      case 'semiannually':
        // "半年";
        return ['上', '上', '下', '下'][index - 1] + '半年'
      // return ['上', '上', '下', '下'][getQuarter(toDate(datetime)) - 1] + '半年'
      case 'yearly':
        return year + '年'
      // return formatDate(datetime, 'yyyy年')
    }
    return ''
  })

  const bgColor = computed(() => {
    const colorList = ['blue', 'orange', 'green', 'blue']
    const seq = quota.seq || 0
    return colorList[seq % 4]
  })

  const handleDetailShow = async () => {
    if (showDetail.value) {
      showDetail.value = null
    } else {
      try {
        const resp = await QuotaServe.getQuotaDetail({
          typeId: quota?.id
        })
        showDetail.value = resp.data
      } catch (error) {
        console.log(error)
      }
    }
  }

  return { timestr, bgColor, showDetail, handleDetailShow }
}

export default useQuotaItem
